草庐IT

React 组件

全部标签

javascript - 为什么在 ES6 react 类中需要绑定(bind)

在新的ReactES6类中,this需要按照此处所述进行绑定(bind):http://facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html#autobinding例如:classCounterextendsReact.Component{constructor(){super();this.tick=this.tick.bind(this);}tick(){...}...}对此的解释是因为它是默认行为,但是如果我创建一个ES6类,然后创建它的一个新实例,this将被绑定(bind)importReactf

javascript - Redux:组织容器、组件、 Action 和缩减器

问题:Whatisthemostmaintainableandrecommendedbestpracticefororganisingcontainers,components,actionsandreducersinalargeReact/Reduxapplication?我的看法:当前的趋势似乎是围绕相关的容器组件来组织redux抵押品(actions、reducers、sagas...)。例如/src/components/.../contianers/BookListactions.jsconstants.jsreducer.jsselectors.jssagas.jsinde

javascript - 使用 React 使用随机生成的字符串进行服务器端渲染?

我第一次在我的React/Redux应用程序中尝试服务器端渲染。我现在遇到的一个问题是我需要初始状态有一个随机生成的字符串,然后将其作为Prop传递给我的主要App组件。这显然会导致问题,因为它会为客户端和服务器生成不同的字符串。我能做些什么来阻止这个问题的发生吗?有助于理解的基本结构:App.jsimportReactfrom'react';import{connect}from'react-redux';constApp=({randomStr})=>({randomStr});constmapStateToProps=(state)=>({...});constmapDispat

javascript - vue.js 将数据从父单文件组件传递给子组件

使用单文件架构,我试图将数据(对象)从父组件传递给子组件:App.vueimportappHeaderfrom'./components/appHeader'import{content}from'./content/content.js'exportdefault{components:{appHeader},data:()=>{return{app_content:content}}}appHeader.vue{{app_content}}exportdefault{data:()=>{return{//nothing}},props:['app_content'],created

javascript - 根 Angular 2 组件中的 ng-content

页面显示基本标记、安慰消息和加载指示器。......pagelayoutandloadingstuff...根组件是@Component({selector:'body[app]',template:``})App{}演示该问题的plunker是here.SPA初始化后,它应该引导body元素并编译组件,同时保存现有的基本布局。但是,根组件会忽略ng-content。这导致两个选项。初始布局应仅在引导后转储和显示。或者它应该在根组件模板和HTML文档中复制(可能使用服务器端模板)。它们看起来都不够好。body包含敏感标记,不能将其包装到子组件中以克服此限制。我打算使用AngularUn

javascript - 与阿多尼斯 react

我正在尝试将React与AdonisJs集成以构建SPA。Adonis通过处理到SPA的路由Route.any('*',function*(request,response){yieldresponse.sendView('home')})我在app>Http>routes.js中完全做到了这一点然后我在资源>View中创建了一个home.njk作为我的应用程序的登录页面。现在,我有一个react文件,我在其中创建了一个页脚。我想用React-router处理页脚中的所有链接。React路由器处理url以导航到页面。但是,上面的代码(在Adonis中)表示任何url(*)都将呈现“ho

javascript - 路由、通用应用程序(Nodejs、React)、错误(0、_reactRouter.match)不是函数

我无法修复这个错误...我启动服务器,一切正常,因为我刷新localhost:3000然后它告诉我一个错误:TypeError:(0,_reactRouter.match)不是函数我已经安装了“react-router”:“^4.0.0”importExpressfrom'express';import{RouterContext,match}from'react-router';import{renderToString}from'react-dom/server';importReactfrom'react';importroutesfrom'./routes.js'varapp=

javascript - 与 React Native 开 Jest 得到问题

我在尝试运行测试用例代码时遇到错误。我正在使用reactnativewithjest。在升级0.40之前一切正常。现在是0.42,我所有的测试用例都停止工作并在错误之后出现错误。({"Object.":function(module,exports,require,__dirname,__filename,global,jest){importReact,{Component,Children,PropTypes}from'react';^^^^^^SyntaxError:UnexpectedtokenimportattransformAndBuildScript(node_modul

javascript - React JS 在状态中维护数组

我一直在使用Reactstate来维护一些数据。对于整数和字符串,它运行良好,但不幸的是,数组不起作用。在我的组件构造函数中,我有constructor(props){super(props);this.state={terms:5,myArray:[]}然后,我尝试在componentDidUpdate中维护它componentDidUpdate(){this.state={terms:this.state.terms,myArray:this.state.myArray}但是myArray:this.state.myArray不工作。但是terms:this.state.terms

javascript - create-react-app 中的 CSS 链接

create-react-app使用如下所示的App.js启动您:importReact,{Component}from'react';importlogofrom'./logo.svg';import'./App.css';classAppextendsComponent{render(){return(WelcometoReactTogetstarted,editsrc/App.jsandsavetoreload.);}}exportdefaultApp;注意import'./App.css'-此CSS文件的匿名导入。App.css包含App和App-header等CSS类,然后在